<template>
	<view class="leave_box">
		<navTitle :titleRight="''" :title="'公司詳情'"></navTitle>
		<view class="msg-box" v-if="!isLoading"> <!-- 只有当加载完成时才显示数据 -->
			<view class="d-title">{{detaiObj.company.enterpriseinfo.company_name}}</view>
			<view class="d-desc">{{detaiObj.company.enterpriseinfo.company_scale.name}}
				{{detaiObj.company.enterpriseinfo.industry_category.name}}
			</view>
			<view class="d-txt">
				<img src="/static/images/job/icon_job_b_gz.png" mode="scaleToFill" alt="">
				<view v-if=" detaiObj.attendance_rule.length>0">上午 {{ detaiObj.attendance_rule && detaiObj.attendance_rule[0] ? formatTime(detaiObj.attendance_rule[0].begin) : '' }} - 下午 {{ detaiObj.attendance_rule && detaiObj.attendance_rule[0] ? formatTime(detaiObj.attendance_rule[0].end) : '' }}</view>
			</view>
			<view class="d-txt">
				<img src="/static/images/job/icon_job_b_fl.png" mode="scaleToFill" alt="">
				 <view v-for="(benefit, index) in detaiObj.company.enterpriseinfo.benefits" :key="index">
					 <view class="fl">
					 	{{ benefit.name }}
					 </view>
				  </view>
			</view>
			<view class="d-title margin-top-30">公司地址</view>
			<view class="d-desc">{{detaiObj.company.enterpriseinfo.address}}</view>
			<view class="d-title margin-top-30">公司簡介</view>
			<view class="d-desc">{{detaiObj.company.enterpriseinfo.intro}}
			</view>
			<!-- <view class="d-title margin-top-30">主营业务</view>
			<view class="d-desc">城市運營、進出口貿易、物流運輸</view> -->
		</view>
		<!-- 加载中状态 -->
		<view v-else class="loading">加载中...</view>
	</view>
</template>


<script>
	import {
		companyDetail
	} from '../../utils/api';
	import navTitle from './../boss/components/nav-title.vue';
	export default {
		components: {
			navTitle
		},
		data() {
			return {
				isLoading: true, // 用来控制加载状态
				detaiObj: {

				},
				showCalendar: false,
				reason: '',
				stepsCurrent: -1,
				steps: [{
						name: '直接主管：'
					},
					{
						name: '總經理：'
					}
				],
				vacationIndex: 0,
				vacationList: ['事假', '調休', '病假', '年假', '產假', '陪產假', '婚假', '例假', '喪假'],
				startDate: '',
				endDate: '',
			};
		},
		props: {
			couponList: {}
		},
		computed: {
			reasonLen() {
				return this.reason.length
			},
			timeDays() {

			}
		},
		onLoad(options) {
			console.log(options, 'ss')
			this.companyDetail(options.id)
		},
		methods: {
			formatTime(time) {
				if (!time) return '';
				const [hour, minute] = time.split(':');
				return `${parseInt(hour)}.${minute}`;
			},
			submitApply() {
				uni.showModal({
					title: '提示',
					content: `確定提交請假申請嗎？`,
					success: res => {
						console.log('999')
					}
				});
			},
			async companyDetail(e) {
				try {
					let res = await companyDetail({
						company_id: e
					});
					this.detaiObj = res.data || {}; // 确保数据安全
					this.isLoading = false; // 数据加载完成，关闭加载状态
					console.log(this.detaiObj, '4545pp'); // 现在可以正确打印 detaiObj
				} catch (error) {
					console.error("公司详情获取失败：", error);
					this.isLoading = false; // 即使请求失败，也关闭加载状态
				}
			},
			changeCalendar(e) {
				this.startDate = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}`
			},
			changeCalendarEnd(e) {
				this.endDate = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}`
			},
			changeVacationType() {
				let that = this
				uni.showActionSheet({
					itemList: that.vacationList,
					title: '請假類型',
					success: ({
						tapIndex
					}) => {
						this.vacationIndex = tapIndex
					},
					fail: (error) => {}
				})
			},
		}
	};
</script>
<style lang="scss" scoped>
	.leave_box {
		width: 100%;
		height: 100vh;
		// overflow-y: scroll;
		background: #F4F6FA;
	}

	.msg-box {
		width: calc(100% - 20px);
		padding: 15px 20px;
		margin: 10px auto;
		background: #fff;
		border-radius: 10px;
	}

	.d-title {
		height: 28px;
		font-weight: 600;
		font-size: 20px;
		color: #333333;
		line-height: 28px;
	}

	.d-desc {
		font-size: 14px;
		color: #333333;
		line-height: 20px;
		margin: 10px 0 17px;
	}

	.d-txt {
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		font-size: 14px;
		color: #333333;
		line-height: 20px;
		margin-bottom: 20px;

		img {
			width: 16px;
			height: 16px;
			margin-right: 8px;
		}
		.fl{
			margin-right: 10rpx;
		}
	}

	.margin-top-30 {
		margin-top: 30px;
	}
</style>